<!DOCTYPE html>
<html lang="en">

<head>
    <title></title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="../css/index.css" rel="stylesheet">
    <link rel="stylesheet" href="../bootstrap-3.4.1-dist/css/bootstrap.min.css">
</head>

<body>

    <div class="header">
        <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
            <div class="nav">
                <div class="nav-mian ">
                    <div class="nav-left"> <a class="nav-logo">广州幻猎科技有限公司</a></div>

                    <div class="flex nav-right">
                        <ul>
                            <li class="cur"><a href="/html/index.html">首页</a></li>
                            <li><a href="/html/serve.html">服务范围</a></li>
                            <li><a href="/html/info.html">行业资讯</a></li>
                            <li><a href="/html/about.html">关于</a></li>
                        </ul>
                        <div class="tel ">
                            <img src="../img/icon/tel_4.png" alt="">
                            <span>17600088816</span>

                        </div>

                    </div>


                </div>
                <div class="clear"></div>

            </div>

            <!-- Indicators -->
            <ol class="carousel-indicators">
                <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
                <li data-target="#carousel-example-generic" data-slide-to="1"></li>
                <li data-target="#carousel-example-generic" data-slide-to="2"></li>
            </ol>

            <!-- Wrapper for slides -->
            <div class="carousel-inner" role="listbox">
                <div class="item active">
                    <img src="../img/sys_banner1_3.jpg" alt="...">
                    <div class="carousel-caption">

                    </div>
                </div>
                <div class="item">
                    <img src="../img/sys_banner2_3.jpg" alt="...">
                    <div class="carousel-caption">

                    </div>
                </div>
                <div class="item">
                    <img src="../img/sys_banner3_3.jpg" alt="...">
                    <div class="carousel-caption">

                    </div>
                </div>
            </div>

            <!-- Controls -->
            <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
                <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
                <span class="sr-only">Previous</span>
            </a>
            <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
                <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
                <span class="sr-only">Next</span>
            </a>
        </div>
        <div class="container-xing">
            <ul>
                <li>
                    <img src="../img/icon/cn4_4.png" alt="">
                    <img src="" alt="">
                    <div class="title">咨询</div>
                    <span>了解基本诉求及项目预期目标，介绍我司<br>基本情况及合作流程
                    </span>
                </li>
                <li>
                    <img src="../img/icon/cn1_4.png" alt="">
                    <img src="" alt="">
                    <div class="title">先调研</div>
                    <span>产品经理现场调研，深挖需求，需求落地<br>输出调研文档及原型
                    </span>
                </li>
                <li>
                    <img src="../img/icon/cn3_4.png" alt="">
                    <img src="" alt="">
                    <div class="title">再签约</div>
                    <span>工期评估明确，确保按期交付开发费用更加<br>精准，避免报价虚高或预算不足
                    </span>
                </li>
            </ul>
        </div>
        <div class="clear"></div>
    </div>
    <div class="IndexService">
        <div class="IndexService-box">
            <div class="IndexService_content">
                <div class="IndexService_content_title">
                    <dd>服务项目 / SERVICE</dd>
                    <dt>广州幻猎科技有限公司 -专业从事定制网站开发，品牌官网、营销型网站，功能型系统开发，响应式设计，APP移动端解决方案。</dt>
                </div>
                <div class="IndexService_content_body">
                    <div class="IndexService_content_bigbox">
                        <div class="body_list_title">定制系统开发</div>
                        <div class="body_list_content">根据企业行业特点和自身需求整合企业网络资源提供Saas信息化管理软件</div>
                        <div class="IndexService_content_box">
                            <div class="let-box bor-2 bor-3">
                                <img src="../img/service/1-1.png" alt="">
                                <p>业务系统定制</p>
                            </div>
                            <div class="let-box bor-3 bor-4">
                                <img src="../img/service/1-2.png" alt="">
                                <p>行业应用软件</p>
                            </div>
                            <div class="let-box bor-1 bor-2">
                                <img src="../img/service/1-3.png" alt="">
                                <p>订单管理系统</p>
                            </div>
                            <div class="let-box bor-1 bor-4">
                                <img src="../img/service/1-4.png" alt="">
                                <p>CRM客户管理系统</p>
                            </div>
                        </div>
                    </div>
                    <div class="IndexService_content_bigbox">
                        <div class="body_list_title">APP开发</div>
                        <div class="body_list_content">专属定制研发应用软件，安全稳定的技术运维服务，为您提供多方位解决方案</div>
                        <div class="IndexService_content_box">
                            <div class="let-box bor-2 bor-3">
                                <img src="../img/service/2-1.png" alt="">
                                <p>IOS APP开发</p>
                            </div>
                            <div class="let-box bor-3 bor-4">
                                <img src="../img/service/2-2.png" alt="">
                                <p>安卓APP开发</p>
                            </div>
                            <div class="let-box bor-1 bor-2">
                                <img src="../img/service/2-3.png" alt="">
                                <p>HTML5开发</p>
                            </div>
                            <div class="let-box bor-1 bor-4">
                                <img src="../img/service/2-4.png" alt="">
                                <p>运维管理</p>
                            </div>
                        </div>
                    </div>
                    <div class="IndexService_content_bigbox">
                        <div class="body_list_title">公众号/小程序</div>
                        <div class="body_list_content">专属定制研发应用软件，安全稳定的技术运维服务，为您提供多方位解决方案</div>
                        <div class="IndexService_content_box">
                            <div class="let-box bor-2 bor-3">
                                <img src="../img/service/3-1.png" alt="">
                                <p>微商系统</p>
                            </div>
                            <div class="let-box bor-3 bor-4">
                                <img src="../img/service/3-2.png" alt="">
                                <p>分销系统</p>
                            </div>
                            <div class="let-box bor-1 bor-2">
                                <img src="../img/service/3-3.png" alt="">
                                <p>互动系统</p>
                            </div>
                            <div class="let-box bor-1 bor-4">
                                <img src="../img/service/3-4.png" alt="">
                                <p>交易系统</p>
                            </div>
                        </div>
                    </div>
                    <div class="IndexService_content_bigbox">
                        <div class="body_list_title">高端网站开发</div>
                        <div class="body_list_content">需求分析-创意设计-程序制作-资料添加-测试交付每一步我们都追求精致</div>
                        <div class="IndexService_content_box">
                            <div class="let-box bor-2 bor-3">
                                <img src="../img/service/4-1.png" alt="">
                                <p>企业官网</p>
                            </div>
                            <div class="let-box bor-3 bor-4">
                                <img src="../img/service/4-2.png" alt="">
                                <p>社区平台</p>
                            </div>
                            <div class="let-box bor-1 bor-2">
                                <img src="../img/service/4-3.png" alt="">
                                <p>综合门户</p>
                            </div>
                            <div class="let-box bor-1 bor-4">
                                <img src="../img/service/4-4.png" alt="">
                                <p>电商网站</p>
                            </div>
                        </div>
                    </div>


                </div>
            </div>
        </div>

    </div>
    <div class="category">
        <div class="main">
            <h1>企业管理系统定制类别</h1>
            <div class="tab_warp">
                <div class="tab_warp_left">
                    <div class="tab_warp_left_box">
                        <img src="../img/icon/ca-1.png" alt="">
                        财务基金管理
                    </div>
                    <div class="tab_warp_left_box">
                        <img src="../img/icon/ca-2.png" alt="">
                        营销服务管理
                    </div>
                    <div class="tab_warp_left_box">
                        <img src="../img/icon/ca-3.png" alt="">
                        供应链生产管理
                    </div>
                    <div class="tab_warp_left_box">
                        <img src="../img/icon/ca-4.png" alt="">
                        办公协调管理
                    </div>
                    <div class="tab_warp_left_box">
                        <img src="../img/icon/ca-5.png" alt="">
                        人力资源管理
                    </div>
                </div>
                <div class="tab_warp_right">
                    <div class="tab_con on" style="display: block;">
                        <h3>财务资金管理</h3>
                        <ul>
                            <li>业务数据分析（BI）</li>
                            <li>项目成本管理系统</li>
                            <li>费用审批系统</li>
                            <li>财务汇集核算系统</li>
                            <li>网络报销审核系统</li>
                            <li>企业基金管理系统</li>
                            <li>商务往来结算系统</li>
                            <li>集团费用分析系统</li>
                            <li>更多......</li>
                        </ul>
                    </div>
                    <div class="tab_con on">
                        <h3>营销服务管理</h3>
                        <ul>
                            <li>销售业务订单执行</li>
                            <li>服务行业运营管理系统</li>
                            <li>微信客服服务系统</li>
                            <li>分销系统管理系统</li>
                            <li>连锁门店管理系统</li>
                            <li>会员体系管理系统</li>
                            <li>企业集成呼叫中心</li>
                            <li>售后服务管理系统</li>
                            <li>更多......</li>
                        </ul>
                    </div>
                    <div class="tab_con on">
                        <h3>供应链生产管理</h3>
                        <ul>
                            <li>库存存货管理系统</li>
                            <li>存货成本控制系统</li>
                            <li>企业采购询价系统</li>
                            <li>商品质量管理系统</li>
                            <li>商品配货管理系统</li>
                            <li>企业销售管理系统</li>
                            <li>电商订单平台系统</li>
                            <li>生产计划管理系统</li>
                            <li>更多......</li>
                        </ul>
                    </div>
                    <div class="tab_con on">
                        <h3>办公协同管理</h3>
                        <ul>
                            <li>OA协同办公系统</li>
                            <li>企业项目协同管理</li>
                            <li>业务审批流程管理</li>
                            <li>企业知识管理系统</li>
                            <li>企业云会议管理系统</li>
                            <li>企业云办公网络平台</li>
                            <li>企业微信互动系统</li>
                            <li>商务合同管理系统</li>
                            <li>更多......</li>
                        </ul>
                    </div>
                    <div class="tab_con on">
                        <h3>人力资源管理</h3>
                        <ul>
                            <li>HR人力资源管理</li>
                            <li>人力考勤管理系统</li>
                            <li>人员绩效管理系统</li>
                            <li>企业招聘管理系统</li>
                            <li>人事合同管理系统</li>
                            <li>员工薪酬管理系统</li>
                            <li>企业福利保险管理系统</li>
                            <li>企业文化管理系统</li>
                            <li>更多......</li>
                        </ul>
                    </div>
                </div>

            </div>
        </div>
    </div>
    <div class="project_list">
        <div class="main">
            <h1>项目交付清单</h1>
            <div class="project-box ">
                <div class="project-left">
                    <div class="project-left-box">
                        <div class="t-box">
                            <dd>需求文档</dd>
                            <dt>Requirement document</dt>
                        </div>
                        <img src="../img/project-list/1-1.png" alt="">
                    </div>
                    <div class="project-left-box">
                        <div class="t-box">
                            <dd>原型文档</dd>
                            <dt>Prototype document</dt>
                        </div>
                        <img src="../img/project-list/1-2.png" alt="">
                    </div>
                    <div class="project-left-box">
                        <div class="t-box">
                            <dd>UI源文件</dd>
                            <dt>UI source file</dt>
                        </div>
                        <img src="../img/project-list/1-3.png" alt="">
                    </div>
                    <div class="project-left-box">
                        <div class="t-box">
                            <dd>源代码</dd>
                            <dt>Source code</dt>
                        </div>
                        <img src="../img/project-list/1-4.png" alt="">
                    </div>
                    <div class="project-left-box">
                        <div class="t-box">
                            <dd>系统部署文件</dd>
                            <dt>System Deployment File</dt>
                        </div>
                        <img src="../img/project-list/1-5.png" alt="">
                    </div>
                </div>
                <div class="project-mid">
                    <img src="../img/qd_05_3.png" alt="">


                </div>
                <div class="project-right">
                    <div class="project-right-box">
                        <img src="../img/project-list/2-1.png" alt="">
                        <div class="t-box">
                            <dd>接口文档</dd>
                            <dt>Interface document</dt>
                        </div>

                    </div>
                    <div class="project-right-box">
                        <img src="../img/project-list/2-2.png" alt="">
                        <div class="t-box">
                            <dd>运维文档</dd>
                            <dt>Maintenance document</dt>
                        </div>

                    </div>
                    <div class="project-right-box">
                        <img src="../img/project-list/2-3.png" alt="">
                        <div class="t-box">
                            <dd>架构设计</dd>
                            <dt>Architecture design</dt>
                        </div>

                    </div>
                    <div class="project-right-box">
                        <img src="../img/project-list/2-4.png" alt="">

                        <div class="t-box">
                            <dd>数据字典</dd>
                            <dt>Data dictionaryt</dt>
                        </div>

                    </div>
                    <div class="project-right-box">
                        <img src="../img/project-list/2-5.png" alt="">
                        <div class="t-box">
                            <dd>测试报告</dd>
                            <dt>Test report</dt>
                        </div>

                    </div>
                </div>

            </div>
            <div class="project-list-box">
                <ul>
                    <li>
                        <img src="../img/project-list/1-1.png" alt="">
                        <h3>需求文档</h3>
                    </li>
                    <li>
                        <img src="../img/project-list/1-2.png" alt="">
                        <h3>原型文档</h3>
                    </li>
                    <li>
                        <img src="../img/project-list/1-3.png" alt="">
                        <h3>UI源文件</h3>
                    </li>
                    <li>
                        <img src="../img/project-list/1-4.png" alt="">
                        <h3>源代码</h3>
                    </li>
                    <li>
                        <img src="../img/project-list/1-5.png" alt="">
                        <h3>系统部署文件</h3>
                    </li>
                    <li>
                        <img src="../img/project-list/2-1.png" alt="">
                        <h3>接口文档</h3>
                    </li>
                    <li>
                        <img src="../img/project-list/2-2.png" alt="">
                        <h3>运维文档</h3>
                    </li>
                    <li>
                        <img src="../img/project-list/2-3.png" alt="">
                        <h3>架构设计</h3>
                    </li>
                    <li>
                        <img src="../img/project-list/2-4.png" alt="">
                        <h3>数据字典</h3>
                    </li>
                    <li>
                        <img src="../img/project-list/2-5.png" alt="">
                        <h3>测试报告</h3>
                    </li>


                </ul>
            </div>
        </div>
    </div>
    <div class="Service">
        <h1>我们的服务团队</h1>
        <div class="team-box">
            <div class="team-box-left">
                <div class="leftbox">
                    <p>项目经理</p>
                    <p>PROJECT MANAGER</p>
                </div>
                <div class="leftbox">
                    <p>产品经理</p>
                    <p>BRAND PLANNING CONSULTAN</p>
                </div>
                <div class="leftbox">
                    <p>UI设计师</p>
                    <p>INTERACTIVE EXPERIENCE SPECIALIST</p>
                </div>
                <div class="leftbox">
                    <p>交互工程师</p>
                    <p>CHANNEL INTEGRATION SPECIALIST</p>
                </div>
            </div>
            <div class="team-box-mid">
                <dd><img src="../img/bn99_4.png" alt=""></dd>
                <dt><img src="../img/bn100_4.png" alt=""></dt>
            </div>
            <div class="team-box-right">
                <div class="rightbox">
                    <p>架构工程师</p>
                    <p>ANALYST</p>
                </div>
                <div class="rightbox">
                    <p>后端工程师</p>
                    <p>OPTIMIZATION CONSULTANT</p>
                </div>
                <div class="rightbox">
                    <p>PHP工程师</p>
                    <p>SENIOR OPTIMIZATION</p>
                </div>
                <div class="rightbox">
                    <p>测试工程师</p>
                    <p>EXECUTIVE COMMISSIONER</p>
                </div>
            </div>
        </div>
    </div>
    <div class="Service2">
        <h1>服务流程</h1>
        <div class="process-main">
            <div class="process-top">
                <div class="process-top-box">
                    <div class="img-box">
                        <img src="../img/icon/biaodan.png" alt="">
                    </div>
                    <div class="text-box">
                        <p>01.需求征集</p>
                        <p>充分了解客户需求</p>
                    </div>
                </div>
                <div class="arrows">
                    <img src="../img/icon/right.png" alt="">
                </div>
                <div class="process-top-box">
                    <div class="img-box">
                        <img src="../img/service2/02.png" alt="">
                    </div>
                    <div class="text-box">
                        <p>02.调研策划</p>
                        <p>创意构思，合理脑图</p>
                    </div>
                </div>
                <div class="arrows">
                    <img src="../img/icon/right.png" alt="">
                </div>
                <div class="process-top-box">
                    <div class="img-box">
                        <img src="../img/service2/03.png" alt="">
                    </div>
                    <div class="text-box">
                        <p>03.合作签订</p>
                        <p>签订合同，保障双方权益</p>
                    </div>
                </div>
                <div class="arrows">
                    <img src="../img/icon/right.png" alt="">
                </div>

                <div class="process-top-box">

                    <div class="img-box">
                        <img src="../img/service2/04.png" alt="">
                    </div>
                    <div class="text-box">
                        <p>04.页面设计</p>
                        <p>一对一设计，让客户满意为</p>
                    </div>
                    <div class="xia">
                        <img src="../img/icon/bottom.png" alt="">
                    </div>
                </div>

            </div>

            <div class="process-top">
                <div class="process-top-box">
                    <div class="img-box">
                        <img src="../img/service2/08.png" alt="">
                    </div>
                    <div class="text-box">
                        <p>08.全年维护</p>
                        <p>一年365天，全天候积极维护</p>
                    </div>
                </div>
                <div class="arrows">
                    <img src="../img/icon/left.png" alt="">
                </div>
                <div class="process-top-box">
                    <div class="img-box">
                        <img src="../img/service2/07.png" alt="">
                    </div>
                    <div class="text-box">
                        <p>07. 反馈修改</p>
                        <p>发现问题，及时修改绝不拖延</p>
                    </div>
                </div>
                <div class="arrows">
                    <img src="../img/icon/left.png" alt="">
                </div>
                <div class="process-top-box">
                    <div class="img-box">
                        <img src="../img/service2/06.png" alt="">
                    </div>
                    <div class="text-box">
                        <p>06.上线测试</p>
                        <p>多轮测试，杜绝BUG和漏洞</p>
                    </div>
                </div>
                <div class="arrows">
                    <img src="../img/icon/left.png" alt="">
                </div>

                <div class="process-top-box">
                    <div class="img-box">
                        <img src="../img/service2/05.png" alt="">
                    </div>
                    <div class="text-box">
                        <p>05.程序开发</p>
                        <p>专业开发团队，用代码写诗</p>
                    </div>
                </div>
            </div>
        </div>

    </div>
    <div class="technology">

        <div class="technology-mian">
            <h1 class="h1">我们擅长的技术</h1>
            <ul>
                <li>
                    <img src="../img/icon//pt-img207_4.png" alt="">
                    <div>
                        <p>IOS</p>
                        <span>Swift</span>
                        <span>Objective-C</span>
                        <span>Core</span>
                        <span>Date</span>
                        <span>Core Graphica</span>
                        <span>ArKit</span>
                        <span>Cocoa</span>
                    </div>
                </li>
                <li>
                    <img src="../img/icon//pt-img208_4.png" alt="">
                    <div>
                        <p>Android</p>
                        <span>WebKit</span>
                        <span>MediaPlayer</span>
                        <span>OpenGL</span>
                        <span>ES</span>
                        <span>JNI</span>
                        <span>NDK</span>
                        <span>Material Design</span>
                    </div>
                </li>
                <li>
                    <img src="../img/icon//pt-img209_3.png" alt="">
                    <div>
                        <p>HTML5</p>
                        <span>JavaScript</span>
                        <span>Vue</span>
                        <span>React</span>
                        <span>AngularJS</span>
                        <span>BootStrap</span>
                        <span>CSS3</span>
                    </div>
                </li>
                <li>
                    <img src="../img/icon/pt-img210_4.png" alt="">
                    <div>
                        <p>PHP</p>
                        <span>ThinkPHP</span>
                        <span>Yll/Cl</span>
                        <span>Laravel</span>
                        <span>Kohana</span>
                        <span>PHPCMS</span>
                        <span>CakePHP</span>

                    </div>
                </li>
                <li>
                    <img src="../img/icon//pt-img211_4.png" alt="">
                    <div>
                        <p>JAVA</p>
                        <span>SpringBoot</span>
                        <span>Solr</span>
                        <span>SSM/MQ</span>
                        <span>Dubbo</span>
                        <span>Zookeeper</span>

                    </div>
                </li>
                <li>
                    <img src="../img/icon//pt-img212_4.png" alt="">
                    <div>
                        <p>DB</p>
                        <span>Oracle</span>
                        <span>MySQL</span>
                        <span>SQLServer</span>
                        <span>Redis</span>
                        <span>Memcache</span>
                        <span>HBase</span>

                    </div>
                </li>
            </ul>
        </div>
    </div>
    <div class="terminal">
        <div class="terminal-main">
            <h1>全平台、全终端支持，随时随地都可以工作</h1>
            <img src="../img/pt_03_4.jpg" alt="">
        </div>
    </div>
    <div class="footer">

        <div class="footer_content">
            <div class="footer_content_top">
                <div class="content_top_share fl">
                    <div class="footer_logo">
                        <p>广州幻猎科技有限公司</p>
                    </div>
                    <div class="clear"></div>
                </div>
                <div class="content_top_left fl">
                    <div class="top_left_list fl">
                        <dd>
                            <a href="/html/about.html">关于我们</a>
                        </dd>
                        <dt>
                            <a href="/html/about.html">关于我们</a>
                        </dt>
                    </div>
                    <div class="top_left_list fl">
                        <dd>
                            <a href="/html/serve.html">服务项目</a>
                        </dd>
                        <dt>
                            <a href="/html/serve.html">服务项目</a>
                        </dt>
                    </div>
                    <div class="top_left_list fl">
                        <dd>
                            <a href="/html/info.html">行业资讯</a>
                        </dd>
                        <dt>
                            <a href="/html/info.html">行业资讯</a>
                        </dt>
                    </div>
                    <div class="clear"></div>
                </div>
                <div class="content_top_right fr">
                    <div class="top_right_title">联系方式</div>
                    <div class="top_right_content">
                        <div class="right_content_list">
                            <img src="../img/icon/copy.png" alt="">
                            <span>17600088816</span>
                        </div>
                        <div class="right_content_list">
                            <img src="../img/icon/caiqie.png" alt="">
                            <span>customer@magahata.com</span>
                        </div>
                        <div class="right_content_list">
                            <img src="../img/icon/caiqie.png" alt="">
                            <span>广州市海珠区中大科技园1305A</span>
                        </div>
                    </div>
                    <div class="clear"></div>
                </div>
            </div>
        </div>
        <div class="footer_content_copyright"></div>
    </div>
    <div class="topNav">
        <div class="topNav-leftbox">
            <p>广州幻猎</p>
        </div>
        <div class="topNav-rightbox" onclick="btn();">
            <img src="../img/icon/list.png" alt="">
        </div>
    </div>
    <div class="nav-box">
        <div class="nav-box-font"><a href="/html/index.html">首页</a></div>
        <div class="nav-box-font"><a href="/html/serve.html">服务范围</a></div>
        <div class="nav-box-font"><a href="/html/info.html">行业资讯</a></div>
        <div class="nav-box-font"><a href="/html/about.html">关于</a></div>
    </div>
    <div class="bottom">
        <div class="bottom_box">
            <input type="text" placeholder="您的名字">
        </div>
        <div class="bottom_box">
            <input type="text" placeholder="您的号码">
        </div>
        <div class="bottom_box">
            <button>联系我们</button>
        </div>
    </div>
    <!-- <div style="position: relative">
        <div style="height: 100vh; overflow: scroll">

        </div>
        <button></button>
    </div> -->
    

</body>
<script src="../bootstrap-3.4.1-dist/js/jquery-3.4.1.js"></script>
<script src="../bootstrap-3.4.1-dist/js/bootstrap.js"></script>

<script>
    var tab_list = document.querySelector('.tab_warp_left');
    var lis = tab_list.querySelectorAll('.tab_warp_left_box');
    var items = document.querySelectorAll('.tab_con');
    for (let i = 0; i < lis.length; i++) {
        lis[i].setAttribute('index', i);
        lis[i].onmouseenter = function (i) {
            this.style.fontSize = '25px';
        }
        lis[i].onclick = function (i) {


            var index = this.getAttribute('index');
            for (var i = 0; i < items.length; i++) {
                items[i].style.display = 'none';
            }
            items[index].style.display = 'block';
        }
        lis[i].onmouseleave = function (i) {

            this.style.fontSize = '20px';
        }
    }
    $('.carousel').carousel({
        interval: 5000
    })
    var flag = false;
    function btn() {
        if (!flag) {
            $(".nav-box").animate({}, 1500, function () {
                $(".nav-box").css({ "left": "0" });
            });
            flag = !flag
        }
        else {
            $(".nav-box").animate({}, 1500, function () {
                $(".nav-box").css({ "left": "100%" });
            });
            flag = !flag
        }
    }
    function btnOut() {
        $(".nav-box").animate({}, 1500, function () {
            $(".nav-box").css({ "left": "0" });
        });

    }

    function btnIn() {
        $(".nav-box").animate({}, 1500, function () {
            $(".nav-box").css({ "left": "100%" });
        });

    }


</script>

</html>